<!DOCTYPE html>
<html lang="zh-cn">

<head>

  <meta content="text/html;charset=utf-8" http-equiv="content-type">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">

  <title>滑雪族 - 产品详情</title>

  <!-- Bootstrap Core CSS -->
<!-- MetisMenu CSS -->
<!-- Custom CSS -->
<!-- Custom Fonts -->
  <!--webuploader 引入CSS-->
  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
  <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
  <![endif]-->
    <link rel="stylesheet" href="/server/r/bower_components/bootstrap/dist/css/bootstrap.min.css" />
    <link rel="stylesheet" href="/server/r/bower_components/metisMenu/dist/metisMenu.min.css" />
    <link rel="stylesheet" href="/server/r/static/css/sb-admin-2_e507c2b.css" />
    <link rel="stylesheet" type="text/css" href="/server/r/bower_components/font-awesome/css/font-awesome.min.css" />
    <link type="text/css" rel="stylesheet" href="/server/r/static/css/hxz/common_2baa698.css" />
    <link rel="stylesheet" type="text/css" href="/server/r/bower_components/alertify/themes/alertify.core.css" />
    <link rel="stylesheet" type="text/css" href="/server/r/bower_components/alertify/themes/alertify.bootstrap.css" />
    <link rel="stylesheet" type="text/css"
        data-loader href="/server/r/bower_components/fex-webuploader/dist/webuploader.css" />
    <link type="text/css" rel="stylesheet" data-loader href="/server/r/vendor/umeditor/themes/default/css/umeditor.min.css" />
    <link rel="stylesheet" type="text/css" data-loader href="/server/r/bower_components/cropper/dist/cropper.min.css" />
</head>

<body>

<div id="wrapper">
  <input type="hidden" id="type-id" value="${activity.typeId}">
  <input type="hidden" id="activity-id" value="${activity.activityId}">
  <input type="hidden" id="domain" value="${domain}">
  <input type="hidden" id="file-contentType" value="">

  <!--场次二维码的模态窗口-->
  <div class="modal fade" id="activity-qrcode" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
       aria-hidden="true">
    <div class="modal-dialog" style="width: 360px;">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
          <h4 class="modal-title">预览二维码</h4>
          <h5 class="modal-subtitle"></h5>
          <h6>若要将活动以微信文章的形式推送给用户，在下方二维码处鼠标单击右键，图片存储为。保存后，将此二维码添加至微信文章中，扫码进行报名跳转。如果是认证公众号菜单跳转的形式，则可以直接点击复制下方链接进行跳转。</h6>
        </div>
        <div class="modal-body">
          <div id="code1" style="text-align: center;"></div>
          <div class="form-group">
            <label>链接：</label>
            <textarea class="form-control" cols="20" rows="2" id="activity-qrcode-link"></textarea>
          </div>
          <div class="form-group" style="text-align: center;">
            <button class="btn btn-sm btn-success" id="copy-activity-qrcode-link">点击复制链接</button>
          </div>
        </div>
      </div>
      <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
  </div>
  <!--场次二维码的模态窗口-->
  <!-- Navigation -->
  <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">

    <div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
    <span class="sr-only">Toggle navigation</span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </button>
  <a class="navbar-brand" href="activity-list">滑雪族 管理</a>
</div>
<!-- /.navbar-header -->

<ul class="nav navbar-top-links navbar-right">
  <!-- /.dropdown -->
  <li class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
      <i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i>
    </a>
    <ul class="dropdown-menu dropdown-user">
      <li><a href="/manage/logout"><i class="fa fa-sign-out fa-fw"></i> 退出系统</a>
      </li>
    </ul>
    <!-- /.dropdown-user -->
  </li>
  <!-- /.dropdown -->
</ul>
<!-- /.navbar-top-links -->

    <div class="navbar-default sidebar" role="navigation">
      <div class="sidebar-nav navbar-collapse">
        <ul class="nav" id="side-menu">
  <li>
    <a href="#"><i class="fa fa-asterisk fa-fw"></i> 产品管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/activity-list"> 产品查询</a>
      </li>
      <li>
        <a href="/manage/manage-organizer-render-activity"> 产品显示控制</a>
      </li>
    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="/#"><i class="fa fa-male fa-fw"></i> 报名管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/player-list"> 报名查询</a>
      </li>
    </ul>
  </li>
  <li>
    <a href="#"><i class="fa fa-list-alt fa-fw"></i> 订单管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/order-list"> 订单查询</a>
      </li>
      <li>
        <a href="/manage/refund-list"> 退款管理</a>
      </li>
    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="#"><i class="fa fa-check-circle fa-fw"></i> 主办方认证<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/organizer-edit"> 创建主办方</a>
      </li>
      <li>
        <a href="/manage/organizer-list"> 主办方列表</a>
      </li>
      <li>
        <a href="/manage/organizer-print"> 冬令营打印设置</a>
      </li>

    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="#"><i class="fa fa-picture-o fa-fw"></i> 雪场管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/ski-field-edit"> 创建雪场</a>
      </li>
      <li>
        <a href="/manage/ski-field-list"> 雪场列表</a>
      </li>

    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="#"><i class="fa fa-users fa-fw"></i> 教练管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/coach-list"> 预约情况</a>
      </li>
    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="#"><i class="fa fa-credit-card fa-fw"></i> 结算管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/manage-transfer-list"> 转账管理</a>
      </li>
      <li>
        <a href="/manage/manage-withdrawals-apply-list"> 提现申请</a>
      </li>
      <li>
        <a href="/manage/manage-withdrawals-record-list"> 结算列表</a>
      </li>
    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="#"><i class="fa fa-rmb fa-fw"></i> 财务管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/stream-list"> 交易流水</a>
      </li>
      <li>
        <a href="/manage/manage-bill-record-list"> 对账列表</a>
      </li>
    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="#"><i class="fa fa-dollar fa-fw"></i> 营销管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/marketing-list"> 返利管理</a>
      </li>
    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="#"><i class="fa fa-comments fa-fw"></i> 评价管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/comment-list">评价管理</a>
      </li>
    </ul>
  </li>
  <li>
    <a href="#"><i class="fa fa-tasks fa-fw"></i> 定时处理管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/quartz-list"> 定时处理列表</a>
      </li>
    </ul>
    <!-- /.nav-second-level -->
  </li>
  <li>
    <a href="#"><i class="fa fa-wechat fa-fw"></i> 微信页面管理<span class="fa arrow"></span></a>
    <ul class="nav nav-second-level">
      <li>
        <a href="/manage/typography-list"> 微信首页管理</a>
      </li>
      <li>
        <a href="/manage/activity-weight-manage"> 活动置顶</a>
      </li>
    </ul>
    <!-- /.nav-second-level -->
  </li>
</ul>
      </div>
      <!-- /.sidebar-collapse -->
    </div>
    <!-- /.navbar-static-side -->
  </nav>

  <div id="page-wrapper">
    <div class="row">
      <div class="col-lg-12">
        <h3 class="page-header">
          产品详情<span class="subtitle">（${activity.title}）</span>

          <div class="pull-right" id="edit-activity-div">
            <a id="edit-activity" type="button" class="btn btn-sm btn-primary">编辑</a>
            <a id="cannel-activity" type="button" style="display: none;" class="btn btn-sm btn-default">取消</a>
          </div>
        </h3>
      </div>
    </div>

    <div class="row">
      <div class="col-lg-12">
        <div class="table-responsive" style="overflow: hidden">
          <table class="table table-bordered table-striped">
            <thead></thead>
            <tbody>
            <input type="hidden" id="activityId" value="${activity.activityId}">
            <input type="hidden" id="typeId" value="${activity.typeId}">
            <input type="hidden" id="activityDescription" value="${activity.description}">
            <input type="hidden" id="activityPosterUrl" value="${activity.posterUrl}">
            <tr>
              <th>产品ID</th>
              <td>${activity.activityId}</td>
            </tr>
            <tr>
              <th width="100">产品名称</th>
              <td>
                <div class="activity-disEditable" id="title">
                  ${activity.title}
                </div>
                <div class="activity-editable" style="display: none;">
                  <input id="activity-title" class="col-lg-12" value="${activity.title?xhtml}">
                </div>
              </td>
            </tr>
            <tr>
              <th width="100">产品类型</th>
              <td>${activity.typeName}</td>
            </tr>
            <tr>
              <th>简介</th>
              <td>
                <div class="activity-disEditable" id="description">
                  ${activity.description}
                </div>
                <div class="activity-editable" style="display: none;">
                  <#if activity.typeId==1>
                    <div>
                      <label>目的地:</label>
                      <input class="form-control" id="end-place" value="${(endPlace!'')?xhtml}">
                      <label>出发地:</label>
                      <input class="form-control" id="start-place" value="${(startPlace!'')?xhtml}">
                      <label>供应商:</label>
                      <input class="form-control" id="travel-org" value="${(travelOrg!'')?xhtml}">
                    </div>
                    <#else>
                      <input id="activity-description" class="col-lg-12" value="${activity.description?xhtml}">
                  </#if>
                </div>
              </td>
            </tr>
            <tr>
              <th>产品海报</th>
              <td>
                <div class="row">
                  <div class="col-lg-8">
                    <img id="preview-image" src="${activity.posterUrl}" style="width: 100%;">
                  </div>
                  <div id="cutPicture" class="col-lg-4" style="visibility: hidden">
                    <h4>图片预览</h4>
                    <input id="e-x" type="hidden"/>
                    <input id="e-y" type="hidden"/>
                    <input id="e-width" type="hidden"/>
                    <input id="e-height" type="hidden"/>

                    <div class="preview"></div>
                    <p style="text-indent: 2em; margin-top: 10px;">为了显示美观，上传图片的长宽比固定为2:1。</p>
                  </div>
                </div>
                <div class="activity-editable" style="margin-top: 10px;">
                  <div id="filePicker">选择图片</div>
                  <div id="cropper" class="btn btn-success" style="visibility:hidden">上传图片</div>
                </div>
              </td>
            </tr>
            </tbody>
          </table>
        </div>
      </div>

      <div class="col-lg-12">
        <div class="panel-group" id="accordion">
          <div class="panel panel-default">
            <div class="panel-heading">
              <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">${filterRuler(activity.typeId,"activity_title_intro")!''}</a>
              </h4>
            </div>
            <div id="collapseOne" class="panel-collapse collapse ">
              <div class="panel-body">
                <div id="introduction" class="activity-disEditable" style="position: relative;">
                  ${activity.introduction!''}
                </div>
                <div class="activity-editable" style="position: relative;">
                  <div class="row">
                    <div class="col-lg-6" style="max-width: 450px">
                      <script type="text/plain" id="activity-introduction" style="height:300px;">
                        ${activity.introduction!''}



                      </script>
                    </div>
                  </div>
                  <div id="activity-introduction-preview-box" style="position: absolute; left: 450px;top: 0px;"></div>
                </div>
              </div>
            </div>
          </div>

          <div class="panel panel-default">
            <div class="panel-heading">
              <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">${filterRuler(activity.typeId,"activity_title_help")!''}</a>
              </h4>
            </div>
            <div id="collapseTwo" class="panel-collapse collapse ">
              <div class="panel-body">
                <div class="activity-disEditable" id="help">
                  ${activity.help!''}
                </div>
                <div class="activity-editable" style="position: relative;">
                  <div class="row">
                    <div class="col-lg-6" style="max-width: 450px">
                      <script type="text/plain" id="activity-help" style="height:300px;"> ${activity.help!''}</script>
                    </div>
                  </div>
                  <div id="activity-help-preview-box" style="position: absolute; left: 450px;top: 0px;"></div>
                </div>
              </div>
            </div>
          </div>
          <div class="panel panel-default">
            <div class="panel-heading">
              <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">${filterRuler(activity.typeId,"activity_title_statment")!''}</a>
              </h4>
            </div>
            <div id="collapseThree" class="panel-collapse collapse ">
              <div class="panel-body">
                <div class="activity-disEditable" id="legalStatement">
                  ${activity.legalStatement!''}
                </div>
                <div class="activity-editable" style="position: relative;">
                  <div class="row">
                    <div class="col-lg-6" style="max-width: 450px">
                      <script type="text/plain" id="activity-legal-statement" style="height:300px;">
                        ${activity.legalStatement!''}



                      </script>
                    </div>
                  </div>
                  <div id="activity-legal-preview-box" style="position: absolute; left: 450px;top: 0px;"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-lg-12">
        <div class="panel panel-success">
          <div class="panel-body">
            <div class="dataTable_wrapper">
              <table class="table table-striped table-bordered table-hover">
                <thead>
                <tr class="warning no-wrap">
                  <th>ID</th>
                  <th>名称</th>
                  <th>${filterRuler(activity.typeId,"activity_title_address")!''}</th>
                  <th>${filterRuler(activity.typeId,"activity_title_date")!''}</th>
                  <th>报名截止时间</th>
                  <th>分享次数</th>
                  <th>点击量</th>
                  <th>人数限制</th>
                  <th>已报名</th>
                  <th>提现情况</th>
                  <th>状态</th>
                  <th>操作员</th>
                  <th colspan="2">操作</th>
                </tr>
                </thead>
                <tbody id="episode-list-body"></tbody>
              </table>
            </div>
            <div class="pagination dataTables_paginate paging_simple_numbers pull-right" id="pagination" role="status"
                 aria-live="polite"></div>
          </div>
        </div>
      </div>
      <!-- /.col-lg-12 -->
    </div>
    <!-- /.row -->
  </div>
  <!-- /#page-wrapper -->
</div>
<!-- /#wrapper -->
<script id="tpl-activity-design" type="text/template">
  <div id="activity-design" class="activity-design clearfix" style="position: absolute;z-index: 999">
    <div class="app-preview">
      <div class="app-header"></div>
      <div class="app-entry">
        <div class="app-config js-config-region">
          <div class="app-field clearfix editing">
            <h1 class="page-title"><span>手机浏览</span></h1>

            <div class="control-group">
              <div class="custom-title text-left">
                <h2 class="title" id="richtext-title">场次特别说明</h2>
              </div>
            </div>
            <div class="control-group">
              <div class="custom-richtext" id="richtext-box">
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</script>

<script id="tpl-episode-list-item" type="text/template">
  <tr>
    <td>{{episodeId}}</td>
    <td>{{episodeName}}</td>
    <td>{{location}}</td>
    <td>{{datetime(startTime)}} 至<br> {{datetime(endTime)}}</td>
    <td>{{datetime(registerDeadline)}}</td>
    <td>{{share}}次</td>
    <td>{{hint}}次</td>
    <td>{{limitString(playerLimit)}}</td>
    <td>{{playerCount}}人</td>
    /
    <% if(episodeAccount){ %>
    <td>
      可提现{{isNullSetDefault(episodeAccount.availableBalance)}}|已转账{{isNullSetDefault(episodeAccount.transferAccount)}}
    </td>
    <% } else{%>
    <td>暂无数据</td>
    <% } %>
    <td class="no-wrap">{{status2String(status)}}</td>
    <td>{{operator}}</td>
    <td>{{publish(status, episodeId)}}</td>
    <td>
      <a href="/manage/episode-edit?activityId=${activity.activityId}&&episodeId={{episodeId}}" type="button"
         class="btn btn-primary btn-xs">编辑</a>
      <% if (status > 0) { %>
      <% if (isShowPlayerInfo) { %>
      <a href="/manage/player-list?activityId=${activity.activityId}&episodeId={{episodeId}}" type="button"
         class="btn btn-warning btn-xs">报名详情</a>
      <a href="/manage/export-player-by-episode?episodeId={{episodeId}}" target="_blank" type="button"
         class="btn btn-success btn-outline btn-xs">导出excel</a>
      <% } %>
      <% if (isShowCampInfo) { %>
      <a href="/manage/player-list?activityId=${activity.activityId}&episodeId={{episodeId}}" type="button"
         class="btn btn-warning btn-xs">报名详情</a>
      <a href="/manage/export-player-by-episode?episodeId={{episodeId}}" target="_blank" type="button"
         class="btn btn-success btn-outline btn-xs">导出excel</a>
      <% } %>

      <#if activity.typeId == 0 || activity.typeId == 1 || activity.typeId == 5>
        <% if (status !=3) { %>
        <a type="button" data-code="{{episodeId}}" class="btn btn-success btn-danger btn-xs cancel-episode">取消报名</a>
        <% } %>
      </#if>

      <% } else { %>
      <a type="button" data-code="{{episodeId}}" class="btn btn-success btn-danger btn-xs delete-episode">删除</a>
      <% } %>
      <#if activity.typeId == 7>
        {{shareQrCode(activityId,7)}}
        <#else>
          {{shareQrCode(episodeId,0)}}
      </#if>
    </td>
  </tr>
</script>

<div id="hxz-background" class="background" style="display: none; "></div>
<div id="hxz-progressBar" class="progressBar" style="display: none; ">数据加载中，请稍等...</div>

<script src="/server/r/require.js"></script>
<script type="text/javascript">/*resourcemap*/
require.config({paths:{
  "r/bower_components/jquery/dist/jquery.min": "/server/r/bower_components/jquery/dist/jquery.min",
  "r/bower_components/underscore/underscore-min": "/server/r/bower_components/underscore/underscore-min",
  "r/static/js/hxz/hxz.valid": "/server/r/static/js/hxz/hxz.valid_12cc206",
  "r/static/js/hxz/hxz.rest": "/server/r/static/js/hxz/hxz.rest_07c8105",
  "r/bower_components/alertify/alertify.min": "/server/r/bower_components/alertify/alertify.min",
  "r/static/js/alertify-config": "/server/r/static/js/alertify-config_0cc8db2",
  "r/bower_components/bootstrap/dist/js/bootstrap.min": "/server/r/bower_components/bootstrap/dist/js/bootstrap.min",
  "r/bower_components/metisMenu/dist/metisMenu.min": "/server/r/bower_components/metisMenu/dist/metisMenu.min",
  "r/bower_components/select2/dist/js/select2": "/server/r/bower_components/select2/dist/js/select2",
  "r/static/js/hxz/hxz.ui": "/server/r/static/js/hxz/hxz.ui_0a7714d",
  "r/static/js/hxz/hxz": "/server/r/static/js/hxz/hxz_589b155",
  "r/vendor/umeditor/umeditor.config": "/server/r/vendor/umeditor/umeditor.config",
  "r/vendor/umeditor/umeditor": "/server/r/vendor/umeditor/umeditor",
  "r/vendor/umeditor/lang/zh-cn/zh-cn": "/server/r/vendor/umeditor/lang/zh-cn/zh-cn",
  "r/bower_components/fex-webuploader/dist/webuploader": "/server/r/bower_components/fex-webuploader/dist/webuploader",
  "r/bower_components/jquery-qrcode/jquery.qrcode.min": "/server/r/bower_components/jquery-qrcode/jquery.qrcode.min",
  "r/bower_components/cropper/dist/cropper.min": "/server/r/bower_components/cropper/dist/cropper.min",
  "r/vendor/pagination/jquery.pagination": "/server/r/vendor/pagination/jquery.pagination"
}});

    window.UMEDITOR_HOME_URL = "../server/r/vendor/umeditor/";
    window.imageUrl = "/manage/ue/upload.json"
  

  require(['r/static/js/hxz/hxz', "r/vendor/umeditor/lang/zh-cn/zh-cn", 'r/static/js/alertify-config', 'r/bower_components/fex-webuploader/dist/webuploader', "r/bower_components/jquery-qrcode/jquery.qrcode.min", "r/bower_components/cropper/dist/cropper.min", "r/vendor/pagination/jquery.pagination"], function (hxz, UM, alertify, WebUploader) {
    /*定义当前的产品信息是否在编辑状态
     true表示可编辑 目前不是在编辑状态*/
    var editable;

    var pagination = false;
    var pageList = [];

    //实例化编辑器
    var um_introduction = UM.getEditor('activity-introduction');

    um_introduction.addListener('focus', function () {

      var tpl = _.template($("#tpl-activity-design").html());
      $("#activity-introduction-preview-box").html(tpl);

      $("#activity-design").show();
      $("#richtext-title").html(hxz.titleFilter("actIntroduction", $("#type-id").val()));
      $("#richtext-box").html(um_introduction.getContent());
    });

    um_introduction.addListener('blur', function () {
      $("#activity-design").hide();
      $("#activity-introduction-preview-box").html("");
    });

    um_introduction.addListener('contentchange', function () {
      $("#richtext-box").html(um_introduction.getContent());
    });


    var um_help = UM.getEditor('activity-help');

    um_help.addListener('focus', function () {

      var tpl = _.template($("#tpl-activity-design").html());
      $("#activity-help-preview-box").html(tpl);

      $("#activity-design").show();
      $("#richtext-title").html(hxz.titleFilter("actHelp", $("#type-id").val()));
      $("#richtext-box").html(um_help.getContent());
    });

    um_help.addListener('blur', function () {
      $("#activity-design").hide();
      $("#activity-help-preview-box").html("");
    });

    um_help.addListener('contentchange', function () {
      $("#richtext-box").html(um_help.getContent());
    });


    var um_legal = UM.getEditor('activity-legal-statement');

    um_legal.addListener('focus', function () {

      var tpl = _.template($("#tpl-activity-design").html());
      $("#activity-legal-preview-box").html(tpl);

      $("#activity-design").show();
      $("#richtext-title").html(hxz.titleFilter("actStatement", $("#type-id").val()));
      $("#richtext-box").html(um_legal.getContent());
    });

    um_legal.addListener('blur', function () {
      $("#activity-design").hide();
      $("#activity-legal-preview-box").html("");
    });

    um_legal.addListener('contentchange', function () {
      $("#richtext-box").html(um_legal.getContent());
    });

    function fetchActivityList(page) {
      if (!page) {
        page = "1";
      }

      var activityId = $("#activity-id").val();
      hxz.doGet({url: hxz.RestApi.manageEpisodeList + "?activityId=" + activityId + "&page=" + page}, function (data) {
        if (data.status == "0") {
          return alertify.log(data.msg);
        }

        pageList = data.data.dataList;
        render(data.data.dataList, page, data.data.count);
      });
    }

    window.hxz = {};

    window.hxz.episodePublish = function (episodeId) {
      alertify.confirm('确定要发布吗？', function (event) {
        // 点击确认
        if (event) {
          operation(episodeId, hxz.RestApi.manageEpisodePublish);
        }
      });
    };

    window.hxz.episodeStop = function (episodeId) {
      alertify.confirm('确定要暂停报名吗？', function (event) {
        // 点击确认
        if (event) {
          operation(episodeId, hxz.RestApi.manageEpisodeStopEnroll);
        }
      });
    };

    window.hxz.episodeContinue = function (episodeId) {
      alertify.confirm('确定要继续报名吗？', function (event) {
        // 点击确认
        if (event) {
          operation(episodeId, hxz.RestApi.manageEpisodeContinueEnroll);
        }
      });
    };

    function operation(episodeId, url) {
      var data = {
        episodeId: episodeId
      };
      hxz.doPost({url: url, data: data}, function (data) {
        if (data.status == "0") {
          /*弹出提示信息*/
          return alertify.error(data.msg, "danger");
        }
        if (data.status == "1") {
          /*弹出提示信息*/
          alertify.log(data.msg);
          fetchActivityList();
        }
      });
    }

    window.hxz.showQrcode = function (id, typeId) {
      $('#activity-qrcode .modal-subtitle').text("ID: " + id);

      var url;
      if (typeId == 7) {
        var data = {
          domain: $("#domain").val(),
          params: '?activityId=' + id
        };
        url = hxz.getWechatUrl('hotelDetail', data);
      } else {
        var data = {
          domain: $("#domain").val(),
          params: '?episodeId=' + id
        };
        url = hxz.getWechatUrl('episodeDetail', data);
      }

      /*使用qrcode生成这个产品的微信端二位码*/
      $("#code1").html("");
      $("#code1").qrcode({
        render: "canvas", //table方式 或者canvas方式
        width: 180, //宽度
        height: 180, //高度
        text: url
      });

      // 显示链接
      $('#activity-qrcode-link').text(url);

      $("#activity-qrcode").modal("show");
    };

    // 绑定复制
    $('#copy-activity-qrcode-link').on('click', function (e) {
      var link = document.getElementById("activity-qrcode-link");
      link.select(); // 选择对象
      document.execCommand("Copy"); // 执行浏览器复制命令
      alertify.log("已复制到剪切板");
    });

    function render(dataList, page, count) {
      var tpl = _.template($('#tpl-episode-list-item').html());
      $("#episode-list-body").empty();
      for (var i = 0; i < dataList.length; i++) {
        var _data = dataList[i];
        _data.epIndex = (i + 1);
        _data.datetime = hxz.datetime;
        _data.limitString = function (data) {
          data = Number(data);
          if (data == 0) {
            return "无限制";
          } else {
            return data + "人";
          }
        };

        _data.isNullSetDefault = function (data) {
          if (!data) {
            return "0元";
          }
          return data + "元";
        };

        _data.isNotNull = function (data) {
          return data;
        };

        _data.isShowPlayerInfo = false;
        _data.isShowCampInfo = false;


        if ($("#typeId").val() == 0) {
          _data.isShowPlayerInfo = true;
        } else if ($("#typeId").val() == 1) {
          _data.isShowPlayerInfo = true;
        } else if ($("#typeId").val() == 4) {
          _data.isShowPlayerInfo = true;
        } else if ($("#typeId").val() == 5) {
          _data.isShowCampInfo = true;
        } else if ($("#typeId").val() == 6) {
          _data.isShowPlayerInfo = true;
        }

        _data.status2String = function (data) {
          data = Number(data);
          return hxz.episodeStatus(data);
        };

        _data.publish = function (data, episodeId) {
          data = Number(data);
          if (data == 0) {
            return "<a  id=\"btn-episode-pulish\"  type=\"button\"  onclick=\"hxz.episodePublish(" + episodeId + ")\" class=\"btn btn-danger btn-xs\">发布</a>";
          } else if (data == 1 || data == 2) {
            return "<a  id=\"btn-episode-pulish\"  type=\"button\"  onclick=\"hxz.episodeStop(" + episodeId + ")\" class=\"btn btn-danger btn-xs\">暂停报名</a>";
          } else if (data == 5) {
            return "<a  id=\"btn-episode-pulish\"  type=\"button\"  onclick=\"hxz.episodeContinue(" + episodeId + ")\" class=\"btn btn-danger btn-xs\">继续报名</a>";
          } else {
            return "";
          }
        };

        _data.shareQrCode = function (id, typeId) {
          return "<button type=\"button\" class=\"btn btn-fix btn-success btn-xs\" onclick=\"hxz.showQrcode(" + id + "," + typeId + ")\">预览二维码</button>";
        };
        $("#episode-list-body").append(tpl(_data));
      }

      if (pagination) {
        pagination = false;
        $('#pagination').pagination(count, {
          current_page: 0,
          items_per_page: 10,
          num_display_entries: 6,
          callback: function (page_id) {
            //模拟ajax去后端读取页数，获取数据并渲染列表的过程
            fetchActivityList(page_id + 1);
          },
          load_first_page: false,
          prev_text: '上一页',
          next_text: '下一页'
        });
      }
    }


    /*初始化编辑产品的状态*/
    function initEdit() {
      editable = true;
      $(".activity-editable").css('display', 'none');
      $(".activity-disEditable").css('display', 'block');
      $("#cannel-activity").hide();
      $("#edit-activity").html("编辑");
      $("#edit-activity-div").removeClass("fix-edit");
      $(".collapse").removeClass("in");
      //$("#description").html($("#activityDescription").val());
    }


    /*编辑模式下的状态*/
    function activityEditStatus() {
      /*将需要编辑的内容 替换成um,让原来的文本内容不可见*/
      $(".activity-editable").css('display', 'block');
      $(".activity-disEditable").css('display', 'none');
      /*编辑过程中 由于ume的内容过长 所有让按钮在右侧悬浮*/
      $("#edit-activity-div").addClass("fix-edit");
      /*编辑状态中 让取消按钮可见*/
      $("#cannel-activity").show();
      /*编辑状态中 让编辑按钮变成保存修改按钮*/
      $("#edit-activity").html("保存修改");
      /*ume 折叠*/
      $(".collapse").addClass("in");
      /*目前已经是编辑状态 editable态应该是false*/
      editable = false;

      //初始化上传空间
      initUpload();
    }

    function initUpload() {

      $("#filePicker").remove();
      $("#cropper").before("<div id=\"filePicker\">选择图片</div>");

      window.showCropper = false;

      // 初始化Web Uploader
      var uploader = WebUploader.create({

        // 选完文件后，是否自动上传。
        auto: true,

        // swf文件路径
        swf: "../server/r/bower_components/fex-webuploader/dist/Uploader.swf",

        // 文件接收服务端。
        server: '/manage/image/upload.json',
//        server: 'http://image.huaxuezoo.com/upload',

        // 选择文件的按钮。可选。
        // 内部根据当前运行是创建，可能是input元素，也可能是flash.
        pick: {
          id: '#filePicker',
          multiple: false
        },
        // 只允许选择图片文件。
        accept: {
          title: 'Images',
          extensions: 'gif,jpg,jpeg,bmp,png',
          mimeTypes: 'image/*'
        }
      });

      var ajaxbg = $("#hxz-background,#hxz-progressBar");
      ajaxbg.hide();

      // 当有文件添加进来的时候
      uploader.on('fileQueued', function (file) {
        ajaxbg.show();
      });

      uploader.on('beforeFileQueued', function (file) {
        if (file.getSource().size > 310000) {
          alertify.error("上传图片大小不能大于300K", "danger");
          return false;
        }
      });

      // 文件上传成功，给item添加成功class, 用样式标记上传成功。
      uploader.on('uploadSuccess', function (file, response) {
        ajaxbg.hide();
        $("#filePicker").css("display", "none");
        $("#cropper").css("visibility", "visible");
        $("#cutPicture").css("visibility", "visible");
        $("#preview-image").attr("src", response.data.url);
        $("#activityPosterUrl").val(response.data.url);
        $("#file-contentType").val(response.data.contentType);

        window.showCropper = true;
        cropperEvent();
      });
    }

    /*非编辑模式下的状态*/
    function activityDisEditStatus() {
      /*目前已经是非编辑状态 editable态应该是true*/
      editable = true;
      /*非编辑状态中 禁止按钮悬浮*/
      $("#edit-activity-div").removeClass("fix-edit");
      /*非编辑状态中 让编辑按钮变成保存修改按钮*/
      $("#edit-activity").html("编辑");
      /*非编辑状态中 让取消按钮可见*/
      $("#cannel-activity").hide();
      /*将需要编辑的内容 从um替换成文本模式,让原来的um组件不可见*/
      $(".activity-editable").css('display', 'none');
      $(".activity-disEditable").css('display', 'block');
    }


    /**
     * 图片剪辑的事件操作
     */
    function cropperEvent() {
      var $previews = $('.preview');
      $('#preview-image').cropper({
        build: function (e) {
          var $clone = $(this).clone();
          $clone.css({
            display: 'block',
            minWidth: 0,
            minHeight: 0,
            maxWidth: 'none',
            maxHeight: 'none'
          });
          $previews.css({
            width: '100%',
            overflow: 'hidden'
          }).html($clone);
        },
        mouseWheelZoom: false,
        aspectRatio: 2,
        crop: function (e) {

          if (e.x != 0) {
            $("#e-x").val(e.x);
            $("#e-y").val(e.y);
            $("#e-width").val(e.width);
            $("#e-height").val(e.height);
          }

          var imageData = $(this).cropper('getImageData');
          var previewAspectRatio = e.width / e.height;
          $previews.each(function () {
            var $preview = $(this);
            var previewWidth = $preview.width();
            var previewHeight = previewWidth / previewAspectRatio;
            var imageScaledRatio = e.width / previewWidth;
            $preview.height(previewHeight).find('img').css({
              width: imageData.naturalWidth / imageScaledRatio,
              height: imageData.naturalHeight / imageScaledRatio,
              marginLeft: -e.x / imageScaledRatio,
              marginTop: -e.y / imageScaledRatio
            });
          });
        }
      });
    }

    function event() {

      $("#episode-list-body").on("click", ".delete-episode", function () {

        var data = {
          episodeId: $(this).data("code")
        };
        alertify.confirm('确定删除场次吗？', function (event) {
          // 点击确认
          if (event) {
            hxz.doPost({url: hxz.RestApi.manageEpisodeDelete, data: data}, function (data) {
              if (data.status == "1") {
                fetchActivityList();
              } else {
                return alertify.error(data.msg, "danger");
              }
            });
          }
        });
      });


      $("#episode-list-body").on("click", ".cancel-episode", function () {

        var data = {
          episodeId: $(this).data("code")
        };
        alertify.confirm('确定取消报名吗？', function (event) {
          // 点击确认
          if (event) {
            hxz.doPost({url: hxz.RestApi.manageEpisodeCancel, data: data}, function (data) {
              if (data.status == "1") {
                alertify.log(data.msg);
                fetchActivityList();
              } else {
                return alertify.error(data.msg, "danger");
              }
            });
          }
        });
      });

      $("#cropper").on("click", function () {
        var data = {
          x: $("#e-x").val(),
          y: $("#e-y").val(),
          width: $("#e-width").val(),
          height: $("#e-height").val(),
          posterUrl: $("#activityPosterUrl").val(),
          contentType: $("#file-contentType").val()
        };

        hxz.doPost({url: hxz.RestApi.manageActivityEditImg, data: data}, function (data) {
          if (data.status == 0) {
            window.showCropper = true;
            return alertify.error(data.msg, "danger");
          } else {
            window.showCropper = false;
            $("#cropper").css("visibility", "hidden");
            $("#cutPicture").css("visibility", "hidden");
            $("#filePicker").css("display", "block");
            $("#activityPosterUrl").val(data.data);
            $("#preview-image").cropper("destroy");
            $("#preview-image").empty();
            $("#preview-image").attr("src", data.data);
          }
        });
      });
    }

    function editActivity() {
      /*初始化数据*/
      initEdit();
      /*用户点击取消按钮*/
      $("#cannel-activity").on("click", function () {
        /*数据初始化 使用数据初始化的方式 存在一些问题  暂时采用页面刷新方式*/
//        initEdit();
        window.location.href = "/manage/activity-detail?activityId=" + $("#activityId").val();
      });

      $("#edit-activity").on("click", function () {
        if (editable) {
          activityEditStatus();
        } else {
          var description;
          if ($('#type-id').val() == '1') {
            var description = "{" +
                "       \"1\":\"" + hxz.escapeHtml($("#end-place").val()) + "\"," +
                "       \"2\":\"" + hxz.escapeHtml($("#start-place").val()) + "\"," +
                "       \"3\":\"" + hxz.escapeHtml($("#travel-org").val()) + "\"" +
                "           }";
          } else {
            description = $("#activity-description").val();
          }
          var data = {
            activityId: $("#activityId").val(),
            title: $("#activity-title").val(),
            description: description,
            introduction: um_introduction.getContent(),
            help: um_help.getContent(),
            legalStatement: um_legal.getContent(),
            posterUrl: $("#activityPosterUrl").val()
          };

          if (window.showCropper) {
            return alertify.log("正在编辑图片，请上传图片后保存。");
          }

          hxz.doPost({url: hxz.RestApi.manageActivityEdit, data: data}, function (data) {
            if (data.status == "0") {
              return alertify.error(data.msg, "danger");
            }
            if (data.status == "1") {
              activityDisEditStatus();
              /*弹出提示信息*/
              alertify.log(data.msg);
              /*刷新界面 放弃使用*/
              setTimeout(function () {
                window.location.href = "/manage/activity-detail?activityId=" + $("#activityId").val();
              }, 1000);
            }
          });
        }
      });
    }

    function pageInit() {
      pagination = true;
      fetchActivityList(1);
      editActivity();
      event();
    }

    // 执行初始化
    pageInit();

  });

</script>
</body>

</html>
